<template>
  <div>
    <a-card title="角色列表" style="width: 100%">
      <div slot="extra" class="add-box">
        <a-space>
          <a-input-search
              placeholder="输入关键词"
              enter-button
              @search="onSearch"
              class="search"
          />
          <a-button type="danger"> 重置 </a-button>
        </a-space>
      </div>
      <a-table
        :columns="columns"
        :data-source="data"
        :row-key="(record) => record.user_id"
      >
      <div slot="img" slot-scope="row" >
          <img :src="row.user_avatar" alt="" class="good-img" />
        </div>
        <div slot="btn" slot-scope="row" class="btn-box">
          <a-button
            type="danger"
            @click="reset(row.id)"
            :disabled="userState <= 2 ? false : true"
          >
            重置
          </a-button>
        </div>
      </a-table>
    </a-card>
  </div>
</template>

<script>
const columns = [
  {
        dataIndex: "user_id",
        title: "编号",
  },
  {
        dataIndex: "user_name",
        title: "角色名称",
  },
  {
        dataIndex: "user_avatar",
        title: "头像",
        scopedSlots: { customRender: "img" },
  },
  {
        dataIndex: "telephone_number",
        title: "电话",
  },
  {
        dataIndex: "nick_name",
        title: "昵称",
  },
  {
    title: "操作",
    scopedSlots: { customRender: "btn" },
  },
];
import { GetWxUser,ResetWxUser } from "../../network/wxUser";
export default {
    data(){
        return{
            data:[],
            userState: null,
            columns,
            labelCol: { span: 4 },
            wrapperCol: { span: 18 },
            addVisible:false,
            layout: "horizontal",
            visible:false,
            addFrom: {
              username: "",
              email: "",
              password: "",
              state: "",
              userTel: "",
            },
            editFrom: {
              id: "",
              username: "",
              email: "",
              password: "",
              state: "",
              userTel: "",
            },
            pagination: {
              pageSize: 5,
              current: 1,
              total: 0,
            },
            keyWord: "",
        }
    },
    created(){
        this.getTableData(this.keyWord);
        this.userState = this.$store.state.state;
    },
    methods:{
        getTableData(data) {
            GetWxUser({ user_name: data }).then((res) => {
                // this.pagination.total = Number(res.data.totalSize);
                this.data = res.data.data;
                console.log(this.data);
            });
        },
        reset(id){
          ResetWxUser({id:id}).then((res)=>{
            console.log(res);
          })
        },
        onSearch(e) {
          // console.log(e);
          this.getTableData(e);
        },
        change(e) {
          console.log(e);
          this.pagination.current = e.current;
        },
    }
};
</script>

<style>
</style>